{% extends "base.html" %}


{% block title %}
<title>晋哆咕-标签</title>
{% endblock %}


{% block css %}
<style>
    .img_items {
        position: relative;
        margin-top: 30px;
    }
    .img-tag {
        width: 200px;
        height: 300px;
    }
    .img-tag+span {
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        width: 100%;
        text-align: center;
        padding: 5px 0;
    }
    .nav>li>a>img {
        max-width: 130px;
        max-height: 60px;
    }
</style>
{% endblock %}


{% block body %}
<div class="row">
    <h3 style="color:red">全部标签:</h3>
    {% for tag in tags %}
    <span><a style="text-decoration:none;color: red;" href="/tag/{{ tag.id }}" target="_blank">{{ tag.title }}</a></span>
    {% endfor %}
    <div class="col-8">
        <h3 style="color:hotpink">当前标签:{{ c_tag }}</h3>
        <div class="row">
                {% if c_tag.book_set.all %}
                    {% for book in c_tag.book_set.all %}
                        <div class="col-md-2 col-md-offset-1 img_items">
                            <a href="/detail/{{ book.id }}">
                                <img class="img-tag" src="/media/{{ book.img }}" alt="">
                                <span>{{ book.title }}</span>
                            </a>
                        </div>
                    {% endfor %}
                {% else %}
                    <h1 class="text-decoration:none;" style="color:hotpink">等待你的发现</h1>
                {% endif %}

        </div>
    </div>
</div>
{% endblock %}
